<template>
  <view class="page">
    <view
      class="content"
      :style="{ paddingTop: contentHeight }"
    >
      <view class="index-logo">
        <img src="https://img.alicdn.com/imgextra/i1/1034622205/O1CN01gGL9rQ1S9wNRaC7tW_!!1034622205.png" />
      </view>
      <view class="index-title">
        <nut-avatar>
          <img
            src="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png"
          />
        </nut-avatar>
        <view class="index-user">
          <view class="index-user-name">
            <view class="index-user-name-top">
              <text>薛之谦</text>
              <text>·</text>
              <text>技术部</text>
            </view>
            <view class="index-user-name-bottom">
              <text>03月15</text>
              <text>星期三</text>
            </view>
          </view>
          <view class="day">开启美好一天！</view>
        </view>
      </view>
      <view class="task">
        <view
          class="task-item add-task"
          @click="handleAddTask"
        >
          <view class="task-button-box">
            <view class="add-task-button">新建任务</view>
            <view class="add-task-text">劳逸结合</view>
          </view>
          <img
            src="https://img.alicdn.com/imgextra/i3/1034622205/O1CN01h8MTMX1S9wNSgAdLt_!!1034622205.png"
            alt=""
          />
        </view>
        <view
          class="task-item task-list"
          @click="handleTaskList"
        >
          <view class="task-button-box">
            <view class="list-task-button">任务管理</view>
            <view class="list-task-text">待处理<text>5</text>项</view>
          </view>
          <img
            src="https://img.alicdn.com/imgextra/i1/1034622205/O1CN014Rll3O1S9wNQrkmxY_!!1034622205.png"
            alt=""
          />
        </view>
      </view>
      <view class="index-button-list">
        <view
          class="index-button-item"
          @click="handleWorkReport"
        >
          <img src="https://img.alicdn.com/imgextra/i2/1034622205/O1CN01CNXxGo1S9wO276d0o_!!1034622205.png" />
          <text>工作汇报</text>
          <text class="new-button">上新</text>
        </view>
        <view class="index-button-item">
          <img src="https://img.alicdn.com/imgextra/i2/1034622205/O1CN01CNXxGo1S9wO276d0o_!!1034622205.png" />

          <text>员工档案</text>
          <text class="new-button">上新</text>
        </view>
        <view
          class="index-button-item"
          @click="goCheckIn"
        >
          <img src="https://img.alicdn.com/imgextra/i2/1034622205/O1CN01CNXxGo1S9wO276d0o_!!1034622205.png" />

          <text>打卡</text>
          <text class="new-button">上新</text>
        </view>
        <view class="index-button-item">
          <img src="https://img.alicdn.com/imgextra/i2/1034622205/O1CN01CNXxGo1S9wO276d0o_!!1034622205.png" />

          <text>更多功能</text>
          <text class="new-button">上新</text>
        </view>
      </view>
      <view class="index-message">
        <view class="index-message-box">
          <view class="index-message-left">
            <img src="https://img.alicdn.com/imgextra/i1/1034622205/O1CN01Xz0EH41S9wNRPgFCx_!!1034622205.png" />
          </view>
          <view class="index-message-right">
            <view
              class="index-message-right-item"
              v-for="itm in 2"
              :key="itm"
            >
              <view class="message-right-item-box">
                <nut-tag
                  round
                  type="primary"
                  plain
                  >消息</nut-tag
                >
                <view class="message-right-item-text"
                  >您有一条新的待办事项您有一条新的待办事项您有一条新的待办事项您有一条新的待办事项</view
                >
              </view>
              <text>·</text>
            </view>
          </view>
        </view>
      </view>
      <view>
        <my-to-do />
      </view>
      <view class="index-img">
        <img src="https://img.alicdn.com/imgextra/i1/1034622205/O1CN01Wq0djF1S9wNR3sp4K_!!1034622205.png" />
      </view>
      <view>
        <todays-schedule />
      </view>
    </view>
    <view style="height: 500rpx; width: 100%">
      <nut-swiper
        :init-page="2"
        :auto-play="3000"
        pagination-visible
        pagination-color="#426543"
        pagination-unselected-color="#808080"
      >
        <nut-swiper-item
          v-for="(item, index) in lists"
          :key="index"
          style="height: 150px"
        >
          <img
            :src="item"
            alt=""
            style="height: 100%; width: 100%"
            draggable="false"
          />
        </nut-swiper-item>
      </nut-swiper>
    </view>
  </view>
</template>

<script setup lang="ts">
import { onBeforeMount, ref, onMounted } from "vue";
import myToDo from "./myToDo/index.vue";
import todaysSchedule from "./todaysSchedule/index.vue";
import { navigateTo, useLoad, showToast } from "@tarojs/taro";
import Taro from "@tarojs/taro";
import { getNavbarInfo } from "@/utils/system";
import { userInfoStore } from "@/stores/userInfoStore";
const store = userInfoStore();

import { wechatLogin } from "@/libs/wechat/runtime/index";
const show = ref(false);
const userPhone = ref("");
const isGetData = ref(false);
const contentHeight = ref();
const navbarStyle = ref({});
//页面加载
const lists = ref([
  "https://storage.360buyimg.com/jdc-article/NutUItaro34.jpg",
  "https://storage.360buyimg.com/jdc-article/NutUItaro2.jpg",
  "https://storage.360buyimg.com/jdc-article/welcomenutui.jpg",
  "https://storage.360buyimg.com/jdc-article/fristfabu.jpg",
]);
useLoad(e => {
  // 先注释，等接口返回
  // if (!localStorage.getItem("token")) {
  //   navigateTo({
  //     url: "/pages/login/index",
  //   });
  // }
});
onMounted(async () => {
  if (process.env.TARO_ENV === "weapp") {
    const { statusBarHeight } = getNavbarInfo();
    navbarStyle.value = {
      paddingTop: `${statusBarHeight}px`,
    };
    contentHeight.value = `calc(44px + ${statusBarHeight}px)`;
  }
});
const handleAddTask = () => {
  console.log(6666);

  navigateTo({
    url: "/packageB/pages/addTask/index",
  });
};
const handleTaskList = () => {
  navigateTo({
    url: "/packageB/pages/taskManagement/index",
  });
};
const handleWorkReport = () => {
  navigateTo({
    url: "/packageB/pages/workReport/index",
  });
};
const onClick = () => {
  show.value = true;
};
const goCheckIn = () => {
  navigateTo({
    url: "/packageC/pages/checkIn/index",
  });
};
</script>
<style lang="less">
@import "./index.less";
</style>
